Theme 037A

Category

Tag

All Colors

書体変更

/temp/unittest/parts/031_catchText_catchText_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText g-fontFamily-gothic"><span><span><span></span></span></span>
            <div class="t0-b-catchText__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText2 g-fontFamily-gothic"><span><span><span></span></span></span>
            <div class="t0-b-catchText2__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText g-fontFamily-mincho"><span><span><span></span></span></span>
            <div class="t0-b-catchText__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText2 g-fontFamily-mincho"><span><span><span></span></span></span>
            <div class="t0-b-catchText2__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText g-fontFamily-marugo"><span><span><span></span></span></span>
            <div class="t0-b-catchText__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

キャッチコピーを入れてください

キャッチコピーの補足を入れてください

キャッチコピーの補足を入れてください

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-catchText2 g-fontFamily-marugo"><span><span><span></span></span></span>
            <div class="t0-b-catchText2__text-sub"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.0">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub2"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.1">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-main"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.2">キャッチコピーを入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub3"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.3">キャッチコピーの補足を入れてください</p>
            </div>
            <div class="t0-b-catchText2__text-sub4"><span><span><span></span></span></span>
                <p data-cms-path="data.contents.4">キャッチコピーの補足を入れてください</p>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/032_lv1H-mainH_lv1H-mainH_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH t0-b-lv1H-mainH--align- g-fontFamily-gothic">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH2 t0-b-lv1H-mainH2--align- g-fontFamily-gothic">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH2__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH2__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH2__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>
明朝系
バリエーション1
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH t0-b-lv1H-mainH--align- g-fontFamily-mincho">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>
明朝系
バリエーション2
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH2 t0-b-lv1H-mainH2--align- g-fontFamily-mincho">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH2__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH2__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH2__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH t0-b-lv1H-mainH--align- g-fontFamily-marugo">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)

ページ見出し

ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)
<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv1H-mainH2 t0-b-lv1H-mainH2--align- g-fontFamily-marugo">
            <span><span><span></span></span></span>
            <div class="t0-b-lv1H-mainH2__caption-upper" data-cms-path="data.contents.0">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
            <h1 class="t0-b-lv1H-mainH2__bd" data-cms-path="data.contents.1">ページ見出し</h1>
            <div class="t0-b-lv1H-mainH2__caption-lower" data-cms-path="data.contents.2">ページ見出しを補足する文を書いてください(例:Welcome to Sample Company)</div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/033_lv2H_lv2H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H t0-b-lv2H--align- t0-b-lv2H--size-2 g-fontFamily-gothic" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H__iconPlacer">
                    <span class="t0-b-lv2H__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H2 t0-b-lv2H2--align- t0-b-lv2H2--size-2 g-fontFamily-gothic" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H2__iconPlacer">
                    <span class="t0-b-lv2H2__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H t0-b-lv2H--align- t0-b-lv2H--size-2 g-fontFamily-mincho" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H__iconPlacer">
                    <span class="t0-b-lv2H__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H2 t0-b-lv2H2--align- t0-b-lv2H2--size-2 g-fontFamily-mincho" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H2__iconPlacer">
                    <span class="t0-b-lv2H2__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H t0-b-lv2H--align- t0-b-lv2H--size-2 g-fontFamily-marugo" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H__iconPlacer">
                    <span class="t0-b-lv2H__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

大見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H2 t0-b-lv2H2--align- t0-b-lv2H2--size-2 g-fontFamily-marugo" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H2__iconPlacer">
                    <span class="t0-b-lv2H2__icon"></span>
                </div>
                <h2 data-cms-path="data.contents.0">大見出し</h2>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/034_lv3H_lv3H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2 g-fontFamily-gothic" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H__iconPlacer">
                    <span class="t0-b-lv3H__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H2 t0-b-lv3H2--align- t0-b-lv3H2--size-2 g-fontFamily-gothic" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H2__iconPlacer">
                    <span class="t0-b-lv3H2__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2 g-fontFamily-mincho" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H__iconPlacer">
                    <span class="t0-b-lv3H__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H2 t0-b-lv3H2--align- t0-b-lv3H2--size-2 g-fontFamily-mincho" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H2__iconPlacer">
                    <span class="t0-b-lv3H2__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2 g-fontFamily-marugo" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H__iconPlacer">
                    <span class="t0-b-lv3H__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

中見出し

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv3H2 t0-b-lv3H2--align- t0-b-lv3H2--size-2 g-fontFamily-marugo" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv3H2__iconPlacer">
                    <span class="t0-b-lv3H2__icon"></span>
                </div>
                <h3 data-cms-path="data.contents.0">中見出し</h3>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/035_lv4H_lv4H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H t0-b-lv4H--align- t0-b-lv4H--size-2 g-fontFamily-gothic" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H__box">
                <div class="t0-b-lv4H__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H2 t0-b-lv4H2--align- t0-b-lv4H2--size-2 g-fontFamily-gothic" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H2__box">
                <div class="t0-b-lv4H2__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H2__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H2__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
明朝系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H t0-b-lv4H--align- t0-b-lv4H--size-2 g-fontFamily-mincho" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H__box">
                <div class="t0-b-lv4H__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
明朝系
バリエーション2
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H2 t0-b-lv4H2--align- t0-b-lv4H2--size-2 g-fontFamily-mincho" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H2__box">
                <div class="t0-b-lv4H2__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H2__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H2__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H t0-b-lv4H--align- t0-b-lv4H--size-2 g-fontFamily-marugo" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H__box">
                <div class="t0-b-lv4H__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H2 t0-b-lv4H2--align- t0-b-lv4H2--size-2 g-fontFamily-marugo" data-height-part=""><span><span><span></span></span></span>
            <div class="t0-b-lv4H2__box">
                <div class="t0-b-lv4H2__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4H2__bd"><span><span><span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4H2__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/036_lv4H-numIcon_lv4H-numIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon t0-b-lv4H-numIcon--align- t0-b-lv4H-numIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon__iconPlacer">
                    <span class="t0-b-lv4H-numIcon__icon t0-b-lv4H-numIcon__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon__bd">
                    <div class="t0-b-lv4H-numIcon__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon2 t0-b-lv4H-numIcon2--align- t0-b-lv4H-numIcon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon2__iconPlacer">
                    <span class="t0-b-lv4H-numIcon2__icon t0-b-lv4H-numIcon2__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon2__bd">
                    <div class="t0-b-lv4H-numIcon2__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon2__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon2__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon t0-b-lv4H-numIcon--align- t0-b-lv4H-numIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon__iconPlacer">
                    <span class="t0-b-lv4H-numIcon__icon t0-b-lv4H-numIcon__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon__bd">
                    <div class="t0-b-lv4H-numIcon__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon2 t0-b-lv4H-numIcon2--align- t0-b-lv4H-numIcon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon2__iconPlacer">
                    <span class="t0-b-lv4H-numIcon2__icon t0-b-lv4H-numIcon2__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon2__bd">
                    <div class="t0-b-lv4H-numIcon2__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon2__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon2__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon t0-b-lv4H-numIcon--align- t0-b-lv4H-numIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon__iconPlacer">
                    <span class="t0-b-lv4H-numIcon__icon t0-b-lv4H-numIcon__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon__bd">
                    <div class="t0-b-lv4H-numIcon__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
アイコン見出し補足

アイコン見出し

アイコン見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-numIcon2 t0-b-lv4H-numIcon2--align- t0-b-lv4H-numIcon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-numIcon2__iconPlacer">
                    <span class="t0-b-lv4H-numIcon2__icon t0-b-lv4H-numIcon2__icon--anshin-1"></span>
                </div>
                <div class="t0-b-lv4H-numIcon2__bd">
                    <div class="t0-b-lv4H-numIcon2__caption-upper" data-cms-path="data.contents.0">アイコン見出し補足</div>
                    <h4 class="t0-b-lv4H-numIcon2__h" data-cms-path="data.contents.1">アイコン見出し</h4>
                    <div class="t0-b-lv4H-numIcon2__caption-lower" data-cms-path="data.contents.2">アイコン見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/037_lv5H_lv5H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H t0-b-lv5H--align- t0-b-lv5H--size-2 g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-lv5H__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H__main">
                <div class="t0-b-lv5H__bd">
                    <div class="t0-b-lv5H__iconPlacer"><span class="t0-b-lv5H__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H2 t0-b-lv5H2--align- t0-b-lv5H2--size-2 g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-lv5H2__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H2__main">
                <div class="t0-b-lv5H2__bd">
                    <div class="t0-b-lv5H2__iconPlacer"><span class="t0-b-lv5H2__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H2__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>
明朝系
バリエーション1
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H t0-b-lv5H--align- t0-b-lv5H--size-2 g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-lv5H__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H__main">
                <div class="t0-b-lv5H__bd">
                    <div class="t0-b-lv5H__iconPlacer"><span class="t0-b-lv5H__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>
明朝系
バリエーション2
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H2 t0-b-lv5H2--align- t0-b-lv5H2--size-2 g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-lv5H2__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H2__main">
                <div class="t0-b-lv5H2__bd">
                    <div class="t0-b-lv5H2__iconPlacer"><span class="t0-b-lv5H2__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H2__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H t0-b-lv5H--align- t0-b-lv5H--size-2 g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-lv5H__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H__main">
                <div class="t0-b-lv5H__bd">
                    <div class="t0-b-lv5H__iconPlacer"><span class="t0-b-lv5H__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
小見出し補足
小見出し
小見出し補足
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-lv5H2 t0-b-lv5H2--align- t0-b-lv5H2--size-2 g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-lv5H2__caption-upper" data-cms-path="data.contents.0">小見出し補足</div>
            <div class="t0-b-lv5H2__main">
                <div class="t0-b-lv5H2__bd">
                    <div class="t0-b-lv5H2__iconPlacer"><span class="t0-b-lv5H2__icon"></span></div>
                    <h5 data-cms-path="data.contents.1">小見出し</h5>
                </div>
            </div>
            <div class="t0-b-lv5H2__caption-lower" data-cms-path="data.contents.2">小見出し補足</div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/038_lv5H-subH_lv5H-subH_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv5H-subH t0-b-lv5H-subH--align- t0-b-lv5H-subH--size-2 g-fontFamily-gothic" data-height-part="">
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>
明朝系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv5H-subH t0-b-lv5H-subH--align- t0-b-lv5H-subH--size-2 g-fontFamily-mincho" data-height-part="">
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv5H-subH t0-b-lv5H-subH--align- t0-b-lv5H-subH--size-2 g-fontFamily-marugo" data-height-part="">
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/039_media_media_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                            <div class="t0-b-media__h-upper t0-b-media--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media__textOnImage-upper">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media__textOnImage-lower">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media__h-lower t0-b-media--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-gothic">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media2 t0-b-media2--width-" data-height-part="">
                            <div class="t0-b-media2__h-upper t0-b-media2--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media2__textOnImage-upper">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media2__textOnImage-lower">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media2__h-lower t0-b-media2--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-gothic">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media3 t0-b-media3--width-" data-height-part="">
                            <div class="t0-b-media3__h-upper t0-b-media3--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media3__textOnImage-upper">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media3__textOnImage-lower">
                                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media3__h-lower t0-b-media3--align- g-fontFamily-gothic">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-gothic">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                            <div class="t0-b-media__h-upper t0-b-media--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media__textOnImage-upper">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media__textOnImage-lower">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media__h-lower t0-b-media--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-mincho">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media2 t0-b-media2--width-" data-height-part="">
                            <div class="t0-b-media2__h-upper t0-b-media2--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media2__textOnImage-upper">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media2__textOnImage-lower">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media2__h-lower t0-b-media2--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-mincho">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media3 t0-b-media3--width-" data-height-part="">
                            <div class="t0-b-media3__h-upper t0-b-media3--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media3__textOnImage-upper">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media3__textOnImage-lower">
                                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media3__h-lower t0-b-media3--align- g-fontFamily-mincho">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-mincho">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                            <div class="t0-b-media__h-upper t0-b-media--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media__textOnImage-upper">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media__textOnImage-lower">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media__h-lower t0-b-media--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-marugo">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media2 t0-b-media2--width-" data-height-part="">
                            <div class="t0-b-media2__h-upper t0-b-media2--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media2__textOnImage-upper">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media2__textOnImage-lower">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media2__h-lower t0-b-media2--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media2__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-marugo">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

詳細はこちらへ
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-media3 t0-b-media3--width-" data-height-part="">
                            <div class="t0-b-media3__h-upper t0-b-media3--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.0">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__media">
                                <span><span><span></span></span></span>
                                <div class="t0-b-media3__textOnImage-upper">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.5">
                                        画像内文字
                                    </p>
                                </div>
                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                <div class="t0-b-media3__textOnImage-lower">
                                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.6">
                                        画像内文字
                                    </p>
                                </div>
                            </div>
                            <div class="t0-b-media3__h-lower t0-b-media3--align- g-fontFamily-marugo">
                                <div data-cms-path="data.contents.2">
                                    画像見出し
                                </div>
                            </div>
                            <div class="t0-b-media3__caption">
                                <p data-cms-path="data.contents.3">
                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-2 t0-b-navItem--width- t0-b-navItem--align-c g-fontFamily-marugo">
            <div data-cms-path="data.contents.4">
                <span></span>
                <div data-cms-contenteditable="data.contents.4.text">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/040_navItem_navItem_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-gothic" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-mincho" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-marugo" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/040_navItem_navItemDouble_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.0">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.1">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.0">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.1">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.0">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.1">
                                <span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/041_navItemCaptioned_navItemCaptioned_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-" data-height-part="">
            <div class=" g-fontFamily-gothic">
                <span></span>
                <div data-cms-path="data.contents.0">
                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-" data-height-part="">
            <div class=" g-fontFamily-mincho">
                <span></span>
                <div data-cms-path="data.contents.0">
                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-" data-height-part="">
            <div class=" g-fontFamily-marugo">
                <span></span>
                <div data-cms-path="data.contents.0">
                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/041_navItemCaptioned_navItemCaptionedDouble_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-gothic">
                                <span></span>
                                <div data-cms-path="data.contents.0">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-gothic">
                                <span></span>
                                <div data-cms-path="data.contents.2">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.3">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-mincho">
                                <span></span>
                                <div data-cms-path="data.contents.0">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-mincho">
                                <span></span>
                                <div data-cms-path="data.contents.2">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.3">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-marugo">
                                <span></span>
                                <div data-cms-path="data.contents.0">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.1">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemCaptioned t0-b-navItemCaptioned--size-3 t0-b-navItemCaptioned--width- t0-b-navItemCaptioned--align-">
                            <div class=" g-fontFamily-marugo">
                                <span></span>
                                <div data-cms-path="data.contents.2">
                                    <div class="t0-b-navItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navItemCaptioned__caption" data-cms-path="data.contents.3">誘導リンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/042_navItem2Captioned_navItem2Captioned_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem2Captioned" data-height-part="">
            <div>
                <div class="t0-b-navItem2Captioned__icon"></div>
                <div class="t0-b-navItem2Captioned__text g-fontFamily-gothic" data-cms-path="data.contents.1">
                    <div class="t0-b-navItem2Captioned__caption-upper" data-cms-path="data.contents.0">誘導リンク補足</div>
                    <div class="t0-b-navItem2Captioned__main" data-cms-contenteditable="data.contents.1.text">
                        詳細はこちらへ
                    </div>
                    <div class="t0-b-navItem2Captioned__caption-lower" data-cms-path="data.contents.2">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem2Captioned" data-height-part="">
            <div>
                <div class="t0-b-navItem2Captioned__icon"></div>
                <div class="t0-b-navItem2Captioned__text g-fontFamily-mincho" data-cms-path="data.contents.1">
                    <div class="t0-b-navItem2Captioned__caption-upper" data-cms-path="data.contents.0">誘導リンク補足</div>
                    <div class="t0-b-navItem2Captioned__main" data-cms-contenteditable="data.contents.1.text">
                        詳細はこちらへ
                    </div>
                    <div class="t0-b-navItem2Captioned__caption-lower" data-cms-path="data.contents.2">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
誘導リンク補足
詳細はこちらへ
誘導リンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navItem2Captioned" data-height-part="">
            <div>
                <div class="t0-b-navItem2Captioned__icon"></div>
                <div class="t0-b-navItem2Captioned__text g-fontFamily-marugo" data-cms-path="data.contents.1">
                    <div class="t0-b-navItem2Captioned__caption-upper" data-cms-path="data.contents.0">誘導リンク補足</div>
                    <div class="t0-b-navItem2Captioned__main" data-cms-contenteditable="data.contents.1.text">
                        詳細はこちらへ
                    </div>
                    <div class="t0-b-navItem2Captioned__caption-lower" data-cms-path="data.contents.2">誘導リンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/043_navItemWithImg_navItemWithImg_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width-m t0-b-navItemWithImg--align-c" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div class="t0-b-navItemWithImg__img">
                    <img src="https://placehold.jp/400x160.png">
                </div>
                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-gothic">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width-m t0-b-navItemWithImg--align-c" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div class="t0-b-navItemWithImg__img">
                    <img src="https://placehold.jp/400x160.png">
                </div>
                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-mincho">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width-m t0-b-navItemWithImg--align-c" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div class="t0-b-navItemWithImg__img">
                    <img src="https://placehold.jp/400x160.png">
                </div>
                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-marugo">
                    詳細はこちらへ
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/043_navItemWithImg_navItemWithImgDouble_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-gothic">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.1.text" class="t0-b-navItemWithImg__text g-fontFamily-gothic">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-mincho">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.1.text" class="t0-b-navItemWithImg__text g-fontFamily-mincho">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.0.text" class="t0-b-navItemWithImg__text g-fontFamily-marugo">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navItemWithImg t0-b-navItemWithImg--imgR t0-b-navItemWithImg--width- t0-b-navItemWithImg--align-">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div class="t0-b-navItemWithImg__img">
                                    <img src="https://placehold.jp/400x160.png">
                                </div>
                                <div data-cms-contenteditable="data.contents.1.text" class="t0-b-navItemWithImg__text g-fontFamily-marugo">
                                    詳細はこちらへ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/048_lv2H-faqIcon_lv2H-faqIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

よくあるご質問

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H-faqIcon t0-b-lv2H-faqIcon--align- t0-b-lv2H-faqIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H-faqIcon__iconPlacer">
                    <span class="t0-b-lv2H-faqIcon__icon"></span>
                </div>
                <h2 class="t0-b-lv2H-faqIcon__h" data-cms-path="data.contents.0">よくあるご質問</h2>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

よくあるご質問

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H-faqIcon t0-b-lv2H-faqIcon--align- t0-b-lv2H-faqIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H-faqIcon__iconPlacer">
                    <span class="t0-b-lv2H-faqIcon__icon"></span>
                </div>
                <h2 class="t0-b-lv2H-faqIcon__h" data-cms-path="data.contents.0">よくあるご質問</h2>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

よくあるご質問

<div class="ex-leftSpacingTweak-">
    <div class="b-bPlacer-4s">

        <div class="t0-b-lv2H-faqIcon t0-b-lv2H-faqIcon--align- t0-b-lv2H-faqIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <span><span><span></span></span></span>
            <div>
                <div class="t0-b-lv2H-faqIcon__iconPlacer">
                    <span class="t0-b-lv2H-faqIcon__icon"></span>
                </div>
                <h2 class="t0-b-lv2H-faqIcon__h" data-cms-path="data.contents.0">よくあるご質問</h2>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/049_lv4H-caseIcon_lv4H-caseIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon t0-b-lv4H-caseIcon--align- t0-b-lv4H-caseIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon__iconPlacer"><span class="t0-b-lv4H-caseIcon__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon__bd">
                    <div class="t0-b-lv4H-caseIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon__h t0-b-lv4H-caseIcon--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon2 t0-b-lv4H-caseIcon2--align- t0-b-lv4H-caseIcon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon2__iconPlacer"><span class="t0-b-lv4H-caseIcon2__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon2__bd">
                    <div class="t0-b-lv4H-caseIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon2__h t0-b-lv4H-caseIcon2--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon t0-b-lv4H-caseIcon--align- t0-b-lv4H-caseIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon__iconPlacer"><span class="t0-b-lv4H-caseIcon__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon__bd">
                    <div class="t0-b-lv4H-caseIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon__h t0-b-lv4H-caseIcon--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon2 t0-b-lv4H-caseIcon2--align- t0-b-lv4H-caseIcon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon2__iconPlacer"><span class="t0-b-lv4H-caseIcon2__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon2__bd">
                    <div class="t0-b-lv4H-caseIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon2__h t0-b-lv4H-caseIcon2--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon t0-b-lv4H-caseIcon--align- t0-b-lv4H-caseIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon__iconPlacer"><span class="t0-b-lv4H-caseIcon__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon__bd">
                    <div class="t0-b-lv4H-caseIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon__h t0-b-lv4H-caseIcon--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
見出し補足(上)

事例のご紹介

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-caseIcon2 t0-b-lv4H-caseIcon2--align- t0-b-lv4H-caseIcon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-caseIcon2__iconPlacer"><span class="t0-b-lv4H-caseIcon2__icon"></span></div>
                <div class="t0-b-lv4H-caseIcon2__bd">
                    <div class="t0-b-lv4H-caseIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-caseIcon2__h t0-b-lv4H-caseIcon2--align-" data-cms-path="data.contents.1">
                        事例のご紹介
                    </h4>
                    <div class="t0-b-lv4H-caseIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/050_lv4H-voiceIcon_lv4H-voiceIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon t0-b-lv4H-voiceIcon--align- t0-b-lv4H-voiceIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon__iconPlacer"><span class="t0-b-lv4H-voiceIcon__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon__bd">
                    <div class="t0-b-lv4H-voiceIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon__h t0-b-lv4H-voiceIcon--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon2 t0-b-lv4H-voiceIcon2--align- t0-b-lv4H-voiceIcon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon2__iconPlacer"><span class="t0-b-lv4H-voiceIcon2__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon2__bd">
                    <div class="t0-b-lv4H-voiceIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon2__h t0-b-lv4H-voiceIcon2--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon t0-b-lv4H-voiceIcon--align- t0-b-lv4H-voiceIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon__iconPlacer"><span class="t0-b-lv4H-voiceIcon__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon__bd">
                    <div class="t0-b-lv4H-voiceIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon__h t0-b-lv4H-voiceIcon--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon2 t0-b-lv4H-voiceIcon2--align- t0-b-lv4H-voiceIcon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon2__iconPlacer"><span class="t0-b-lv4H-voiceIcon2__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon2__bd">
                    <div class="t0-b-lv4H-voiceIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon2__h t0-b-lv4H-voiceIcon2--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon t0-b-lv4H-voiceIcon--align- t0-b-lv4H-voiceIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon__iconPlacer"><span class="t0-b-lv4H-voiceIcon__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon__bd">
                    <div class="t0-b-lv4H-voiceIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon__h t0-b-lv4H-voiceIcon--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
見出し補足(上)

お客様の声

見出し補足(下)
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-voiceIcon2 t0-b-lv4H-voiceIcon2--align- t0-b-lv4H-voiceIcon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-voiceIcon2__iconPlacer"><span class="t0-b-lv4H-voiceIcon2__icon"></span></div>
                <div class="t0-b-lv4H-voiceIcon2__bd">
                    <div class="t0-b-lv4H-voiceIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-voiceIcon2__h t0-b-lv4H-voiceIcon2--align-" data-cms-path="data.contents.1">
                        お客様の声
                    </h4>
                    <div class="t0-b-lv4H-voiceIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/051_lv4H-qIcon_lv4H-qIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon t0-b-lv4H-qIcon--align- t0-b-lv4H-qIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon__iconPlacer"><span class="t0-b-lv4H-qIcon__icon"></span></div>
                <div class="t0-b-lv4H-qIcon__bd">
                    <div class="t0-b-lv4H-qIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon__h t0-b-lv4H-qIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon2 t0-b-lv4H-qIcon2--align- t0-b-lv4H-qIcon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon2__iconPlacer"><span class="t0-b-lv4H-qIcon2__icon"></span></div>
                <div class="t0-b-lv4H-qIcon2__bd">
                    <div class="t0-b-lv4H-qIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon2__h t0-b-lv4H-qIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon t0-b-lv4H-qIcon--align- t0-b-lv4H-qIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon__iconPlacer"><span class="t0-b-lv4H-qIcon__icon"></span></div>
                <div class="t0-b-lv4H-qIcon__bd">
                    <div class="t0-b-lv4H-qIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon__h t0-b-lv4H-qIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon2 t0-b-lv4H-qIcon2--align- t0-b-lv4H-qIcon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon2__iconPlacer"><span class="t0-b-lv4H-qIcon2__icon"></span></div>
                <div class="t0-b-lv4H-qIcon2__bd">
                    <div class="t0-b-lv4H-qIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon2__h t0-b-lv4H-qIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon t0-b-lv4H-qIcon--align- t0-b-lv4H-qIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon__iconPlacer"><span class="t0-b-lv4H-qIcon__icon"></span></div>
                <div class="t0-b-lv4H-qIcon__bd">
                    <div class="t0-b-lv4H-qIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon__h t0-b-lv4H-qIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
見出し補足(上)

よくあるご質問(質問を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-qIcon2 t0-b-lv4H-qIcon2--align- t0-b-lv4H-qIcon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-qIcon2__iconPlacer"><span class="t0-b-lv4H-qIcon2__icon"></span></div>
                <div class="t0-b-lv4H-qIcon2__bd">
                    <div class="t0-b-lv4H-qIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-qIcon2__h t0-b-lv4H-qIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(質問を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-qIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/052_lv4H-aIcon_lv4H-aIcon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon t0-b-lv4H-aIcon--align- t0-b-lv4H-aIcon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon__iconPlacer"><span class="t0-b-lv4H-aIcon__icon"></span></div>
                <div class="t0-b-lv4H-aIcon__bd">
                    <div class="t0-b-lv4H-aIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon__h t0-b-lv4H-aIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon2 t0-b-lv4H-aIcon2--align- t0-b-lv4H-aIcon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon2__iconPlacer"><span class="t0-b-lv4H-aIcon2__icon"></span></div>
                <div class="t0-b-lv4H-aIcon2__bd">
                    <div class="t0-b-lv4H-aIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon2__h t0-b-lv4H-aIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon t0-b-lv4H-aIcon--align- t0-b-lv4H-aIcon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon__iconPlacer"><span class="t0-b-lv4H-aIcon__icon"></span></div>
                <div class="t0-b-lv4H-aIcon__bd">
                    <div class="t0-b-lv4H-aIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon__h t0-b-lv4H-aIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon2 t0-b-lv4H-aIcon2--align- t0-b-lv4H-aIcon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon2__iconPlacer"><span class="t0-b-lv4H-aIcon2__icon"></span></div>
                <div class="t0-b-lv4H-aIcon2__bd">
                    <div class="t0-b-lv4H-aIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon2__h t0-b-lv4H-aIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon t0-b-lv4H-aIcon--align- t0-b-lv4H-aIcon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon__iconPlacer"><span class="t0-b-lv4H-aIcon__icon"></span></div>
                <div class="t0-b-lv4H-aIcon__bd">
                    <div class="t0-b-lv4H-aIcon__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon__h t0-b-lv4H-aIcon--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
見出し補足(上)

よくあるご質問(回答を入力してください)

見出し補足(下)
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-lv4H-aIcon2 t0-b-lv4H-aIcon2--align- t0-b-lv4H-aIcon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-aIcon2__iconPlacer"><span class="t0-b-lv4H-aIcon2__icon"></span></div>
                <div class="t0-b-lv4H-aIcon2__bd">
                    <div class="t0-b-lv4H-aIcon2__caption-upper" data-cms-path="data.contents.0">見出し補足(上)</div>
                    <h4 class="t0-b-lv4H-aIcon2__h t0-b-lv4H-aIcon2--align-" data-cms-path="data.contents.1">
                        よくあるご質問(回答を入力してください)
                    </h4>
                    <div class="t0-b-lv4H-aIcon2__caption-lower" data-cms-path="data.contents.2">見出し補足(下)</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/053_lv4H-num2Icon_lv4H-num2Icon_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon t0-b-lv4H-num2Icon--align- t0-b-lv4H-num2Icon--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon__icon t0-b-lv4H-num2Icon__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon__bd">
                    <div class="t0-b-lv4H-num2Icon__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon2 t0-b-lv4H-num2Icon2--align- t0-b-lv4H-num2Icon2--size-2 g-fontFamily-gothic" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon2__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon2__icon t0-b-lv4H-num2Icon2__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon2__bd">
                    <div class="t0-b-lv4H-num2Icon2__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon2__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon2__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon t0-b-lv4H-num2Icon--align- t0-b-lv4H-num2Icon--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon__icon t0-b-lv4H-num2Icon__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon__bd">
                    <div class="t0-b-lv4H-num2Icon__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon2 t0-b-lv4H-num2Icon2--align- t0-b-lv4H-num2Icon2--size-2 g-fontFamily-mincho" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon2__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon2__icon t0-b-lv4H-num2Icon2__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon2__bd">
                    <div class="t0-b-lv4H-num2Icon2__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon2__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon2__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon t0-b-lv4H-num2Icon--align- t0-b-lv4H-num2Icon--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon__icon t0-b-lv4H-num2Icon__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon__bd">
                    <div class="t0-b-lv4H-num2Icon__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
番号見出し補足

番号見出し

番号見出し補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-lv4H-num2Icon2 t0-b-lv4H-num2Icon2--align- t0-b-lv4H-num2Icon2--size-2 g-fontFamily-marugo" data-height-part="">
            <div>
                <div class="t0-b-lv4H-num2Icon2__iconPlacer">
                    <span class="t0-b-lv4H-num2Icon2__icon t0-b-lv4H-num2Icon2__icon--number-1"></span>
                </div>
                <div class="t0-b-lv4H-num2Icon2__bd">
                    <div class="t0-b-lv4H-num2Icon2__caption-upper" data-cms-path="data.contents.0">番号見出し補足</div>
                    <h4 class="t0-b-lv4H-num2Icon2__h" data-cms-path="data.contents.1">番号見出し</h4>
                    <div class="t0-b-lv4H-num2Icon2__caption-lower" data-cms-path="data.contents.2">番号見出し補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/054_siteName_siteName_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-siteTitle g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-siteTitle__bd" data-cms-path="data.contents.0" data-height-part="">
                <div class="t0-b-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-siteTitle__bd-textCol">
                    <p class="t0-b-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <p class="t0-b-siteTitle__bd-siteName" data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                </div>
            </div>
            <p class="t0-b-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
明朝系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-siteTitle g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-siteTitle__bd" data-cms-path="data.contents.0" data-height-part="">
                <div class="t0-b-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-siteTitle__bd-textCol">
                    <p class="t0-b-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <p class="t0-b-siteTitle__bd-siteName" data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                </div>
            </div>
            <p class="t0-b-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-siteTitle g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-siteTitle__bd" data-cms-path="data.contents.0" data-height-part="">
                <div class="t0-b-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-siteTitle__bd-textCol">
                    <p class="t0-b-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <p class="t0-b-siteTitle__bd-siteName" data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                </div>
            </div>
            <p class="t0-b-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/061_lv4HBig_lv4HBig_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-8s">
        <div class="t0-b-lv4HBig t0-b-lv4HBig--align- t0-b-lv4HBig--size-2 g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-lv4HBig__box">
                <div class="t0-b-lv4HBig__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4HBig__bd"><span><span><span><span></span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4HBig__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
明朝系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-8s">
        <div class="t0-b-lv4HBig t0-b-lv4HBig--align- t0-b-lv4HBig--size-2 g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-lv4HBig__box">
                <div class="t0-b-lv4HBig__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4HBig__bd"><span><span><span><span></span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4HBig__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
装飾見出し補足

装飾見出し

装飾見出し補足
<div>
    <div class="b-bPlacer-8s">
        <div class="t0-b-lv4HBig t0-b-lv4HBig--align- t0-b-lv4HBig--size-2 g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-lv4HBig__box">
                <div class="t0-b-lv4HBig__caption-upper" data-cms-path="data.contents.0">装飾見出し補足</div>
                <div class="t0-b-lv4HBig__bd"><span><span><span><span></span></span></span></span>
                    <h4 data-cms-path="data.contents.1">装飾見出し</h4>
                </div>
            </div>
            <div class="t0-b-lv4HBig__caption-lower" data-cms-path="data.contents.2">装飾見出し補足</div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/062_navBItem_navBItem_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width-m t0-b-navBItem--align-c g-fontFamily-gothic" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width-m t0-b-navBItem2--align-c g-fontFamily-gothic" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width-m t0-b-navBItem--align-c g-fontFamily-mincho" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width-m t0-b-navBItem2--align-c g-fontFamily-mincho" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width-m t0-b-navBItem--align-c g-fontFamily-marugo" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width-m t0-b-navBItem2--align-c g-fontFamily-marugo" data-height-part="">
            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/062_navBItem_navBItemDouble_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-gothic">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-mincho">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem t0-b-navBItem--size-3 t0-b-navBItem--width- t0-b-navBItem--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
詳細はこちらへ
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItem2 t0-b-navBItem2--size-3 t0-b-navBItem2--width- t0-b-navBItem2--align- g-fontFamily-marugo">
                            <div data-cms-path="data.contents.1"><span><span><span></span></span></span>
                                <div data-cms-contenteditable="data.contents.1.text">詳細はこちらへ</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/063_navBItemCaptioned_navBItemCaptioned_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width-m t0-b-navBItemCaptioned--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-gothic">
                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width-m t0-b-navBItemCaptioned2--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-gothic">
                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width-m t0-b-navBItemCaptioned--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-mincho">
                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width-m t0-b-navBItemCaptioned2--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-mincho">
                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width-m t0-b-navBItemCaptioned--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-marugo">
                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width-m t0-b-navBItemCaptioned2--align-c" data-height-part="">
            <div data-cms-path="data.contents.0">
                <span><span><span></span></span></span>
                <div class="g-fontFamily-marugo">
                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/063_navBItemCaptioned_navBItemCaptionedDouble_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-gothic">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-gothic">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-gothic">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-gothic">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-mincho">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-mincho">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-mincho">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-mincho">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-marugo">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned t0-b-navBItemCaptioned--size-3 t0-b-navBItemCaptioned--width- t0-b-navBItemCaptioned--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-marugo">
                                    <div class="t0-b-navBItemCaptioned__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
詳細はこちらへ
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-2 t0-b-layoutSplitter--spacing-4s" data-height-part="">
            <div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.0">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-marugo">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.1">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="t0-b-layoutSplitter__div">
                    <div>
                        <div class="t0-b-navBItemCaptioned2 t0-b-navBItemCaptioned2--size-3 t0-b-navBItemCaptioned2--width- t0-b-navBItemCaptioned2--align-">
                            <div data-cms-path="data.contents.2">
                                <span><span><span></span></span></span>
                                <div class="g-fontFamily-marugo">
                                    <div class="t0-b-navBItemCaptioned2__main" data-cms-contenteditable="data.contents.2.text">詳細はこちらへ</div>
                                    <div class="t0-b-navBItemCaptioned2__caption" data-cms-path="data.contents.3">ボタンリンク補足</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/064_navBItem2Captioned_navBItem2Captioned_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned__icon"></div>
                <div class="t0-b-navBItem2Captioned__text g-fontFamily-gothic" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned2" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned2__icon"></div>
                <div class="t0-b-navBItem2Captioned2__text g-fontFamily-gothic" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned2__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned2__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned2__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned__icon"></div>
                <div class="t0-b-navBItem2Captioned__text g-fontFamily-mincho" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned2" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned2__icon"></div>
                <div class="t0-b-navBItem2Captioned2__text g-fontFamily-mincho" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned2__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned2__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned2__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned__icon"></div>
                <div class="t0-b-navBItem2Captioned__text g-fontFamily-marugo" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
ボタンリンク補足
詳細はこちらへ
ボタンリンク補足
<div>
    <div class="b-bPlacer-12s">
        <div class="t0-b-navBItem2Captioned2" data-height-part="">
            <div><span><span><span></span></span></span>
                <div class="t0-b-navBItem2Captioned2__icon"></div>
                <div class="t0-b-navBItem2Captioned2__text g-fontFamily-marugo" data-cms-path="data.contents.1">
                    <div class="t0-b-navBItem2Captioned2__caption-upper" data-cms-path="data.contents.0">ボタンリンク補足</div>
                    <div class="t0-b-navBItem2Captioned2__main" data-cms-contenteditable="data.contents.1.text"><span><span><span></span></span></span>詳細はこちらへ</div>
                    <div class="t0-b-navBItem2Captioned2__caption-lower" data-cms-path="data.contents.2">ボタンリンク補足</div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/1000_frameOuter_acrePartsMain-1mc073_f48.md
  • f48

ブロック名称:書体変更

ゴシック系
バリエーション1

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter">
        <div class="t0-b-frameOuter__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter__hd t0-b-frameOuter__hd--align- t0-b-frameOuter__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter__hd-inner">
                    <div class="t0-b-frameOuter__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter2">
        <div class="t0-b-frameOuter2__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter2__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter2__hd t0-b-frameOuter2__hd--align- t0-b-frameOuter2__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter2__hd-inner">
                    <div class="t0-b-frameOuter2__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter2__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter2__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter2__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter2__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション3

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter3">
        <div class="t0-b-frameOuter3__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter3__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter3__hd t0-b-frameOuter3__hd--align- t0-b-frameOuter3__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter3__hd-inner">
                    <div class="t0-b-frameOuter3__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter3__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter3__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter3__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter3__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション4

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter4">
        <div class="t0-b-frameOuter4__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter4__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter4__hd t0-b-frameOuter4__hd--align- t0-b-frameOuter4__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter4__hd-inner">
                    <div class="t0-b-frameOuter4__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter4__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter4__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter4__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter4__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション5

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter5">
        <div class="t0-b-frameOuter5__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter5__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter5__hd t0-b-frameOuter5__hd--align- t0-b-frameOuter5__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter5__hd-inner">
                    <div class="t0-b-frameOuter5__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter5__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter5__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter5__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter5__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション6

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter6">
        <div class="t0-b-frameOuter6__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter6__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter6__hd t0-b-frameOuter6__hd--align- t0-b-frameOuter6__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter6__hd-inner">
                    <div class="t0-b-frameOuter6__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter6__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter6__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter6__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter6__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション7

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter7">
        <div class="t0-b-frameOuter7__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter7__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter7__hd t0-b-frameOuter7__hd--align- t0-b-frameOuter7__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter7__hd-inner">
                    <div class="t0-b-frameOuter7__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter7__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter7__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter7__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter7__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション8

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter8">
        <div class="t0-b-frameOuter8__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter8__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter8__hd t0-b-frameOuter8__hd--align- t0-b-frameOuter8__hd--size-2 g-fontFamily-gothic" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter8__hd-inner">
                    <div class="t0-b-frameOuter8__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter8__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter8__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter8__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter8__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter">
        <div class="t0-b-frameOuter__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter__hd t0-b-frameOuter__hd--align- t0-b-frameOuter__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter__hd-inner">
                    <div class="t0-b-frameOuter__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter2">
        <div class="t0-b-frameOuter2__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter2__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter2__hd t0-b-frameOuter2__hd--align- t0-b-frameOuter2__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter2__hd-inner">
                    <div class="t0-b-frameOuter2__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter2__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter2__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter2__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter2__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション3

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter3">
        <div class="t0-b-frameOuter3__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter3__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter3__hd t0-b-frameOuter3__hd--align- t0-b-frameOuter3__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter3__hd-inner">
                    <div class="t0-b-frameOuter3__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter3__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter3__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter3__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter3__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション4

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter4">
        <div class="t0-b-frameOuter4__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter4__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter4__hd t0-b-frameOuter4__hd--align- t0-b-frameOuter4__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter4__hd-inner">
                    <div class="t0-b-frameOuter4__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter4__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter4__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter4__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter4__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション5

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter5">
        <div class="t0-b-frameOuter5__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter5__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter5__hd t0-b-frameOuter5__hd--align- t0-b-frameOuter5__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter5__hd-inner">
                    <div class="t0-b-frameOuter5__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter5__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter5__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter5__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter5__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション6

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter6">
        <div class="t0-b-frameOuter6__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter6__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter6__hd t0-b-frameOuter6__hd--align- t0-b-frameOuter6__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter6__hd-inner">
                    <div class="t0-b-frameOuter6__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter6__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter6__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter6__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter6__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション7

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter7">
        <div class="t0-b-frameOuter7__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter7__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter7__hd t0-b-frameOuter7__hd--align- t0-b-frameOuter7__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter7__hd-inner">
                    <div class="t0-b-frameOuter7__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter7__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter7__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter7__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter7__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション8

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter8">
        <div class="t0-b-frameOuter8__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter8__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter8__hd t0-b-frameOuter8__hd--align- t0-b-frameOuter8__hd--size-2 g-fontFamily-mincho" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter8__hd-inner">
                    <div class="t0-b-frameOuter8__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter8__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter8__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter8__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter8__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter">
        <div class="t0-b-frameOuter__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter__hd t0-b-frameOuter__hd--align- t0-b-frameOuter__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter__hd-inner">
                    <div class="t0-b-frameOuter__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter2">
        <div class="t0-b-frameOuter2__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter2__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter2__hd t0-b-frameOuter2__hd--align- t0-b-frameOuter2__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter2__hd-inner">
                    <div class="t0-b-frameOuter2__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter2__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter2__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter2__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter2__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter2__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション3

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter3">
        <div class="t0-b-frameOuter3__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter3__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter3__hd t0-b-frameOuter3__hd--align- t0-b-frameOuter3__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter3__hd-inner">
                    <div class="t0-b-frameOuter3__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter3__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter3__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter3__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter3__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter3__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション4

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter4">
        <div class="t0-b-frameOuter4__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter4__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter4__hd t0-b-frameOuter4__hd--align- t0-b-frameOuter4__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter4__hd-inner">
                    <div class="t0-b-frameOuter4__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter4__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter4__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter4__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter4__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter4__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション5

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter5">
        <div class="t0-b-frameOuter5__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter5__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter5__hd t0-b-frameOuter5__hd--align- t0-b-frameOuter5__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter5__hd-inner">
                    <div class="t0-b-frameOuter5__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter5__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter5__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter5__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter5__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter5__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション6

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter6">
        <div class="t0-b-frameOuter6__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter6__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter6__hd t0-b-frameOuter6__hd--align- t0-b-frameOuter6__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter6__hd-inner">
                    <div class="t0-b-frameOuter6__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter6__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter6__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter6__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter6__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter6__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション7

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter7">
        <div class="t0-b-frameOuter7__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter7__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter7__hd t0-b-frameOuter7__hd--align- t0-b-frameOuter7__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter7__hd-inner">
                    <div class="t0-b-frameOuter7__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter7__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter7__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter7__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter7__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter7__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション8

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

見出し補足(上)

上部見出し

見出し補足(下)

中見出し

画像の説明を入力してください(フォントが小さく設定された文章です)

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

中見出し

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん

詳しくはこちらをクリック
<div class="b-bPlacer-12s">
    <div class="t0-b-frameOuter8">
        <div class="t0-b-frameOuter8__upper outerHtml" data-cms-path="data.contents.0">
            <div class="ex-leftSpacingTweak-">
                <div class="b-bPlacer-7s">
                    <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                        <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="t0-b-frameOuter8__frame">
            <span><span><span></span></span></span>

            <div class="t0-b-frameOuter8__hd t0-b-frameOuter8__hd--align- t0-b-frameOuter8__hd--size-2 g-fontFamily-marugo" data-switchable-key="contents.1.switchable">
                <span><span><span></span></span></span>
                <div class="t0-b-frameOuter8__hd-inner">
                    <div class="t0-b-frameOuter8__hd-caption-upper" data-cms-path="data.contents.2">見出し補足(上)</div>
                    <div class="t0-b-frameOuter8__hd-h">
                        <h2 data-cms-path="data.contents.1">上部見出し</h2>
                    </div>
                    <div class="t0-b-frameOuter8__hd-caption-lower" data-cms-path="data.contents.3">見出し補足(下)</div>
                </div>
            </div>
            <div class="t0-b-frameOuter8__bd">
                <span><span><span></span></span></span>
                <div class="t0-b-frame1col t0-b-mediaCols t0-b-mediaCols--colW-m t0-b-mediaCols--imgR ex-imageFloat ex-spLayout__vertical">
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.4.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.5">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.7">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                            <div class="t0-b-media__caption">
                                                                <p data-cms-path="data.contents.3">
                                                                    画像の説明を入力してください(フォントが小さく設定された文章です)
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.6">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン<br><br>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.8.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.9">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.11">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.10">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row t0-b-frame1col__row t0-b-frame1col__colBasis" data-switchable-key="contents.12.switchable">
                        <div class="t0-b-frame1col__head" data-cms-path="data.contents.13">
                            <div class="ex-leftSpacingTweak-">
                                <div class="b-bPlacer-4s">

                                    <div class="t0-b-lv3H t0-b-lv3H--align- t0-b-lv3H--size-2" data-height-part="">
                                        <span><span><span></span></span></span>
                                        <div>
                                            <div class="t0-b-lv3H__iconPlacer">
                                                <span class="t0-b-lv3H__icon"></span>
                                            </div>
                                            <h3 data-cms-path="data.contents.0">中見出し</h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="t0-b-mediaCols__div">
                            <div class="t0-b-mediaCols__img" data-cms-path="data.contents.15">
                                <div>
                                    <div class="b-bPlacer-3s">
                                        <div class="t0-b-layoutSplitter t0-b-layoutSplitter--count-1 t0-b-layoutSplitter--spacing-4s">
                                            <div>
                                                <div class="t0-b-layoutSplitter__div">
                                                    <div>
                                                        <div class="t0-b-media t0-b-media--width-" data-height-part="">
                                                            <div class="t0-b-media__media">
                                                                <span><span><span></span></span></span>
                                                                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="t0-b-mediaCols__col" data-cms-path="data.contents.14">
                                <div class="ex-leftSpacingTweak-">
                                    <div class="b-bPlacer-7s">
                                        <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                            <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・んアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤャユュヨララリルレロワ・ヲ・ン</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="t0-b-frameOuter8__row" data-cms-path="data.contents.16">
                        <div class="ex-leftSpacingTweak-">
                            <div class="b-bPlacer-7s">
                                <div class="t0-b-wysiwyg" data-cms-path="data.contents.0" data-height-part="">
                                    <p>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゃゆゅよらりるれろわ・を・ん</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="t0-b-frameOuter8__ft outerHtml" data-cms-path="data.contents.17">
        <div>
            <div class="b-bPlacer-4s">
                <div class="t0-b-navItem t0-b-navItem--size-3 t0-b-navItem--width- t0-b-navItem--align-" data-height-part="">
                    <div data-cms-path="data.contents.0">
                        <span></span>
                        <div data-cms-contenteditable="data.contents.0.text">詳しくはこちらをクリック</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/135_sideBoxLv1H_sideBoxLv1H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H t0-b-sideBoxLv1H--align- g-fontFamily-gothic"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H__iconPlacer"><span class="t0-b-sideBoxLv1H__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H2 t0-b-sideBoxLv1H2--align- g-fontFamily-gothic"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H2__iconPlacer"><span class="t0-b-sideBoxLv1H2__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H t0-b-sideBoxLv1H--align- g-fontFamily-mincho"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H__iconPlacer"><span class="t0-b-sideBoxLv1H__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H2 t0-b-sideBoxLv1H2--align- g-fontFamily-mincho"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H2__iconPlacer"><span class="t0-b-sideBoxLv1H2__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H t0-b-sideBoxLv1H--align- g-fontFamily-marugo"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H__iconPlacer"><span class="t0-b-sideBoxLv1H__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
中見出し
<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-sideBoxLv1H2 t0-b-sideBoxLv1H2--align- g-fontFamily-marugo"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv1H2__iconPlacer"><span class="t0-b-sideBoxLv1H2__icon"></span></div>

                <h5 data-cms-path="data.contents.0">中見出し</h5>

            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/136_sideBoxLv2H_sideBoxLv2H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
小見出し
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-sideBoxLv2H t0-b-sideBoxLv2H--align- g-fontFamily-gothic"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv2H__iconPlacer"><span class="t0-b-sideBoxLv2H__icon"></span></div>

                <h6 data-cms-path="data.contents.0">小見出し</h6>

            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
小見出し
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-sideBoxLv2H t0-b-sideBoxLv2H--align- g-fontFamily-mincho"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv2H__iconPlacer"><span class="t0-b-sideBoxLv2H__icon"></span></div>

                <h6 data-cms-path="data.contents.0">小見出し</h6>

            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
小見出し
<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-sideBoxLv2H t0-b-sideBoxLv2H--align- g-fontFamily-marugo"><span><span><span></span></span></span>
            <div>
                <div class="t0-b-sideBoxLv2H__iconPlacer"><span class="t0-b-sideBoxLv2H__icon"></span></div>

                <h6 data-cms-path="data.contents.0">小見出し</h6>

            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/144_sideBoxMedia_sideBoxMedia_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia t0-b-sideBoxMedia--width-">
            <div class="t0-b-sideBoxMedia__caption-upper t0-b-sideBoxMedia--align- g-fontFamily-gothic">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia__textOnImage-upper">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia__textOnImage-lower">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia__caption-lower t0-b-sideBoxMedia--align-">
                <div class="g-fontFamily-gothic" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia2 t0-b-sideBoxMedia2--width-">
            <div class="t0-b-sideBoxMedia2__caption-upper t0-b-sideBoxMedia2--align- g-fontFamily-gothic">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia2__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia2__textOnImage-upper">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia2__textOnImage-lower">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia2__caption-lower t0-b-sideBoxMedia2--align-">
                <div class="g-fontFamily-gothic" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia3 t0-b-sideBoxMedia3--width-">
            <div class="t0-b-sideBoxMedia3__caption-upper t0-b-sideBoxMedia3--align- g-fontFamily-gothic">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia3__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia3__textOnImage-upper">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia3__textOnImage-lower">
                    <p class="g-fontFamily-gothic" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia3__caption-lower t0-b-sideBoxMedia3--align-">
                <div class="g-fontFamily-gothic" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia t0-b-sideBoxMedia--width-">
            <div class="t0-b-sideBoxMedia__caption-upper t0-b-sideBoxMedia--align- g-fontFamily-mincho">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia__textOnImage-upper">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia__textOnImage-lower">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia__caption-lower t0-b-sideBoxMedia--align-">
                <div class="g-fontFamily-mincho" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia2 t0-b-sideBoxMedia2--width-">
            <div class="t0-b-sideBoxMedia2__caption-upper t0-b-sideBoxMedia2--align- g-fontFamily-mincho">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia2__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia2__textOnImage-upper">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia2__textOnImage-lower">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia2__caption-lower t0-b-sideBoxMedia2--align-">
                <div class="g-fontFamily-mincho" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia3 t0-b-sideBoxMedia3--width-">
            <div class="t0-b-sideBoxMedia3__caption-upper t0-b-sideBoxMedia3--align- g-fontFamily-mincho">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia3__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia3__textOnImage-upper">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia3__textOnImage-lower">
                    <p class="g-fontFamily-mincho" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia3__caption-lower t0-b-sideBoxMedia3--align-">
                <div class="g-fontFamily-mincho" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia t0-b-sideBoxMedia--width-">
            <div class="t0-b-sideBoxMedia__caption-upper t0-b-sideBoxMedia--align- g-fontFamily-marugo">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia__textOnImage-upper">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia__textOnImage-lower">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia__caption-lower t0-b-sideBoxMedia--align-">
                <div class="g-fontFamily-marugo" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia2 t0-b-sideBoxMedia2--width-">
            <div class="t0-b-sideBoxMedia2__caption-upper t0-b-sideBoxMedia2--align- g-fontFamily-marugo">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia2__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia2__textOnImage-upper">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia2__textOnImage-lower">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia2__caption-lower t0-b-sideBoxMedia2--align-">
                <div class="g-fontFamily-marugo" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション3
画像見出し

画像内文字

画像内文字

画像見出し
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-sideBoxMedia3 t0-b-sideBoxMedia3--width-">
            <div class="t0-b-sideBoxMedia3__caption-upper t0-b-sideBoxMedia3--align- g-fontFamily-marugo">
                <div data-cms-path="data.contents.0">画像見出し</div>
            </div>
            <div class="t0-b-sideBoxMedia3__main"><span><span><span></span></span></span>
                <div class="t0-b-sideBoxMedia3__textOnImage-upper">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.3">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.1">
                <div class="t0-b-sideBoxMedia3__textOnImage-lower">
                    <p class="g-fontFamily-marugo" data-cms-path="data.contents.4">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-sideBoxMedia3__caption-lower t0-b-sideBoxMedia3--align-">
                <div class="g-fontFamily-marugo" data-cms-path="data.contents.2">画像見出し</div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/151_sideMenu_sideMenu_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu"><span><span><span></span></span></span>
            <div class="b-sideMenu__hd b-sideMenu__hd--align- g-fontFamily-gothic"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu__panel" class="on-off">
            <label for="b-sideMenu__panel">MENU</label>
            <div class="b-sideMenu__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu2"><span><span><span></span></span></span>
            <div class="b-sideMenu2__hd b-sideMenu2__hd--align- g-fontFamily-gothic"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu2__panel" class="on-off">
            <label for="b-sideMenu2__panel">MENU</label>
            <div class="b-sideMenu2__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu"><span><span><span></span></span></span>
            <div class="b-sideMenu__hd b-sideMenu__hd--align- g-fontFamily-mincho"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu__panel" class="on-off">
            <label for="b-sideMenu__panel">MENU</label>
            <div class="b-sideMenu__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu2"><span><span><span></span></span></span>
            <div class="b-sideMenu2__hd b-sideMenu2__hd--align- g-fontFamily-mincho"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu2__panel" class="on-off">
            <label for="b-sideMenu2__panel">MENU</label>
            <div class="b-sideMenu2__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu"><span><span><span></span></span></span>
            <div class="b-sideMenu__hd b-sideMenu__hd--align- g-fontFamily-marugo"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu__panel" class="on-off">
            <label for="b-sideMenu__panel">MENU</label>
            <div class="b-sideMenu__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

サイドメニュー

生成されたサイドメニューが入る
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenu2"><span><span><span></span></span></span>
            <div class="b-sideMenu2__hd b-sideMenu2__hd--align- g-fontFamily-marugo"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenu2__panel" class="on-off">
            <label for="b-sideMenu2__panel">MENU</label>
            <div class="b-sideMenu2__bd" data-cms-path="data.contents.1" data-cms-editable="sidemenu"><span><span><span></span></span></span>
                <div style="border: 1px dashed red;padding: 5px;">生成されたサイドメニューが入る</div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/151_sideMenu_sideMenuHndle_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle__hd b-sideMenuHandle__hd--align- g-fontFamily-gothic"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle__panel" class="on-off">
            <label for="b-sideMenuHandle__panel">MENU</label>
            <div class="b-sideMenuHandle__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle2"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle2__hd b-sideMenuHandle2__hd--align- g-fontFamily-gothic"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle2__panel" class="on-off">
            <label for="b-sideMenuHandle2__panel">MENU</label>
            <div class="b-sideMenuHandle2__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle__hd b-sideMenuHandle__hd--align- g-fontFamily-mincho"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle__panel" class="on-off">
            <label for="b-sideMenuHandle__panel">MENU</label>
            <div class="b-sideMenuHandle__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle2"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle2__hd b-sideMenuHandle2__hd--align- g-fontFamily-mincho"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle2__panel" class="on-off">
            <label for="b-sideMenuHandle2__panel">MENU</label>
            <div class="b-sideMenuHandle2__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle__hd b-sideMenuHandle__hd--align- g-fontFamily-marugo"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle__panel" class="on-off">
            <label for="b-sideMenuHandle__panel">MENU</label>
            <div class="b-sideMenuHandle__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

サイドメニュー

  • 詳細はこちらへ
    • 詳細はこちらへ
      • 詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="b-sideMenuHandle2"><span><span><span></span></span></span>
            <div class="b-sideMenuHandle2__hd b-sideMenuHandle2__hd--align- g-fontFamily-marugo"><span><span><span></span></span></span>
                <h4 data-cms-path="data.contents.0">サイドメニュー</h4>
            </div>
            <input type="checkbox" id="b-sideMenuHandle2__panel" class="on-off">
            <label for="b-sideMenuHandle2__panel">MENU</label>
            <div class="b-sideMenuHandle2__bd" data-cms-path="data.contents.1"><span><span><span></span></span></span>
                <div class="b-sideMenuHandle__list sideMenuHandle1">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                <div>
                                    <span>
                                        <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                    </span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle2">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                                            <div>
                                                <span>
                                                    <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                </span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="b-sideMenuHandle__list sideMenuHandle3">
                    <ul>
                        <li class="b-sideMenuHandle__item">
                            <div class="b-sideMenuHandle__list">
                                <ul>
                                    <li class="b-sideMenuHandle__item">
                                        <div class="b-sideMenuHandle__list">
                                            <ul>
                                                <li class="b-sideMenuHandle__item">
                                                    <div class="b-sideMenuHandle__item2" data-cms-path="data.contents.0">
                                                        <span><span><span></span></span></span>
                                                        <div>
                                                            <span>
                                                                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/163_lv1H-pageH_lv1H-pageH_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH g-fontFamily-gothic">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH__main t0-b-lv1H-pageH--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH2 g-fontFamily-gothic">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH2__main t0-b-lv1H-pageH2--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH g-fontFamily-mincho">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH__main t0-b-lv1H-pageH--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH2 g-fontFamily-mincho">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH2__main t0-b-lv1H-pageH2--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH g-fontFamily-marugo">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH__main t0-b-lv1H-pageH--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

ページ見出し

<div>
    <div class="b-bPlacer-0s">
        <div class="t0-b-lv1H-pageH2 g-fontFamily-marugo">
            <div><span><span><span></span></span></span>
                <h1 class="t0-b-lv1H-pageH2__main t0-b-lv1H-pageH2--align-" data-cms-path="data.contents.0">ページ見出し</h1>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/169_headerUnit-siteName_headerUnit-siteName_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle  g-fontFamily-gothic">
            <div class="t0-b-headerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle2  g-fontFamily-gothic">
            <div class="t0-b-headerUnit-siteTitle2__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle2__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle2__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle2__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle2__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle2__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
明朝系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle  g-fontFamily-mincho">
            <div class="t0-b-headerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
明朝系
バリエーション2

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle2  g-fontFamily-mincho">
            <div class="t0-b-headerUnit-siteTitle2__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle2__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle2__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle2__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle2__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle2__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle  g-fontFamily-marugo">
            <div class="t0-b-headerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-headerUnit-siteTitle2  g-fontFamily-marugo">
            <div class="t0-b-headerUnit-siteTitle2__bd" data-cms-path="data.contents.0">
                <div class="t0-b-headerUnit-siteTitle2__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-headerUnit-siteTitle2__bd-textCol">
                    <p class="t0-b-headerUnit-siteTitle2__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-headerUnit-siteTitle2__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-headerUnit-siteTitle2__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/177_headerUnit-siteName2_headerUnit-siteName2_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-1s">
        <div class="t0-b-headerUnit-siteName2 g-fontFamily-gothic">
            <div class="t0-b-headerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-headerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
明朝系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-1s">
        <div class="t0-b-headerUnit-siteName2 g-fontFamily-mincho">
            <div class="t0-b-headerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-headerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-1s">
        <div class="t0-b-headerUnit-siteName2 g-fontFamily-marugo">
            <div class="t0-b-headerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-headerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/184_footerUnit-media_footerUnit-media_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media t0-b-footerUnit-media--width-">
            <div class="t0-b-footerUnit-media__media">
                <div class="t0-b-footerUnit-media__textOnImage-upper g-fontFamily-gothic">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media__textOnImage-lower g-fontFamily-gothic">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media__nav g-fontFamily-gothic">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media2 t0-b-footerUnit-media2--width-">
            <div class="t0-b-footerUnit-media2__media">
                <div class="t0-b-footerUnit-media2__textOnImage-upper g-fontFamily-gothic">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media2__textOnImage-lower g-fontFamily-gothic">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media2__nav g-fontFamily-gothic">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション3

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media3 t0-b-footerUnit-media3--width-">
            <div class="t0-b-footerUnit-media3__media">
                <div class="t0-b-footerUnit-media3__textOnImage-upper g-fontFamily-gothic">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media3__textOnImage-lower g-fontFamily-gothic">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media3__nav g-fontFamily-gothic">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media t0-b-footerUnit-media--width-">
            <div class="t0-b-footerUnit-media__media">
                <div class="t0-b-footerUnit-media__textOnImage-upper g-fontFamily-mincho">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media__textOnImage-lower g-fontFamily-mincho">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media__nav g-fontFamily-mincho">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media2 t0-b-footerUnit-media2--width-">
            <div class="t0-b-footerUnit-media2__media">
                <div class="t0-b-footerUnit-media2__textOnImage-upper g-fontFamily-mincho">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media2__textOnImage-lower g-fontFamily-mincho">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media2__nav g-fontFamily-mincho">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション3

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media3 t0-b-footerUnit-media3--width-">
            <div class="t0-b-footerUnit-media3__media">
                <div class="t0-b-footerUnit-media3__textOnImage-upper g-fontFamily-mincho">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media3__textOnImage-lower g-fontFamily-mincho">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media3__nav g-fontFamily-mincho">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media t0-b-footerUnit-media--width-">
            <div class="t0-b-footerUnit-media__media">
                <div class="t0-b-footerUnit-media__textOnImage-upper g-fontFamily-marugo">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media__textOnImage-lower g-fontFamily-marugo">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media__nav g-fontFamily-marugo">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media2 t0-b-footerUnit-media2--width-">
            <div class="t0-b-footerUnit-media2__media">
                <div class="t0-b-footerUnit-media2__textOnImage-upper g-fontFamily-marugo">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media2__textOnImage-lower g-fontFamily-marugo">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media2__nav g-fontFamily-marugo">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション3

画像内文字

画像内文字

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-media3 t0-b-footerUnit-media3--width-">
            <div class="t0-b-footerUnit-media3__media">
                <div class="t0-b-footerUnit-media3__textOnImage-upper g-fontFamily-marugo">
                    <p data-cms-path="data.contents.2">画像内文字</p>
                </div>
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-media3__textOnImage-lower g-fontFamily-marugo">
                    <p data-cms-path="data.contents.3">画像内文字</p>
                </div>
            </div>
            <div class="t0-b-footerUnit-media3__nav g-fontFamily-marugo">
                <div data-cms-path="data.contents.1">
                    <a href="" target="" data-cms-contenteditable="data.contents.1.text">大きな地図で見る</a>
                </div>
            </div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/191_footerUnit-siteName_footerUnit-siteName_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3
○○線○○駅から徒歩○分

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-siteTitle g-fontFamily-gothic">
            <div class="t0-b-footerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-footerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-footerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-footerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-footerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3<br>○○線○○駅から徒歩○分</p>
        </div>
    </div>
</div>
明朝系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3
○○線○○駅から徒歩○分

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-siteTitle g-fontFamily-mincho">
            <div class="t0-b-footerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-footerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-footerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-footerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-footerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3<br>○○線○○駅から徒歩○分</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

開業○○年の豊富な経験と高い技術

サンプル株式会社

〒000-0000 ○○県○○市○○町1-2-3
○○線○○駅から徒歩○分

<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-siteTitle g-fontFamily-marugo">
            <div class="t0-b-footerUnit-siteTitle__bd" data-cms-path="data.contents.0">
                <div class="t0-b-footerUnit-siteTitle__bd-logo" data-switchable-key="contents.0.useLogo"><img src="https://placehold.jp/400x160.png"></div>
                <div class="t0-b-footerUnit-siteTitle__bd-textCol">
                    <p class="t0-b-footerUnit-siteTitle__bd-note" data-cms-contenteditable="data.contents.0.upperCaption" data-switchable-key="contents.0.useUpperCaption">開業○○年の豊富な経験と高い技術</p>
                    <div class="t0-b-footerUnit-siteTitle__bd-siteName">
                        <p data-cms-contenteditable="data.contents.0.siteName">サンプル株式会社</p>
                    </div>
                </div>
            </div>
            <p class="t0-b-footerUnit-siteTitle__ft" data-cms-contenteditable="data.contents.0.lowerCaption" data-switchable-key="contents.0.useLowerCaption">〒000-0000 ○○県○○市○○町1-2-3<br>○○線○○駅から徒歩○分</p>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/192_footerUnit-siteName2_footerUnit-siteName2_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-siteName2 g-fontFamily-gothic">
            <div class="t0-b-footerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-footerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
明朝系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-siteName2 g-fontFamily-mincho">
            <div class="t0-b-footerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-footerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

〒000-0000 ○○県○○市○○町1-2-3

<div>
    <div class="b-bPlacer-2s">
        <div class="t0-b-footerUnit-siteName2 g-fontFamily-marugo">
            <div class="t0-b-footerUnit-siteName2__bd">
                <img src="https://placehold.jp/400x160.png" data-cms-path="data.contents.0">
            </div>
            <p class="t0-b-footerUnit-siteName2__ft" data-cms-path="data.contents.1">〒000-0000 ○○県○○市○○町1-2-3</p>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/198_footerUnit-lv2H_footerUnit-lv2H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-lv2H t0-b-footerUnit-lv2H--align- g-fontFamily-gothic"><span><span><span></span></span></span>
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>
明朝系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-lv2H t0-b-footerUnit-lv2H--align- g-fontFamily-mincho"><span><span><span></span></span></span>
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
表組みタイトル
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-footerUnit-lv2H t0-b-footerUnit-lv2H--align- g-fontFamily-marugo"><span><span><span></span></span></span>
            <h5 data-cms-path="data.contents.0">表組みタイトル</h5>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/199_footerUnit-lv1H_footerUnit-lv1H_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1

小見出し

<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-footerUnit-lv1H t0-b-footerUnit-lv1H--align- g-fontFamily-gothic"><span><span><span></span></span></span>
            <h4 data-cms-path="data.contents.0">小見出し</h4>
        </div>
    </div>
</div>
明朝系
バリエーション1

小見出し

<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-footerUnit-lv1H t0-b-footerUnit-lv1H--align- g-fontFamily-mincho"><span><span><span></span></span></span>
            <h4 data-cms-path="data.contents.0">小見出し</h4>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1

小見出し

<div>
    <div class="b-bPlacer-3s">
        <div class="t0-b-footerUnit-lv1H t0-b-footerUnit-lv1H--align- g-fontFamily-marugo"><span><span><span></span></span></span>
            <h4 data-cms-path="data.contents.0">小見出し</h4>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/206_headerFullWidthMedia-text_headerFullWidthMedia-text_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text t0-b-headerFullWidthMedia-text--size-3 t0-b-headerFullWidthMedia-text--width- t0-b-headerFullWidthMedia-text--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text2 t0-b-headerFullWidthMedia-text2--size-3 t0-b-headerFullWidthMedia-text2--width- t0-b-headerFullWidthMedia-text2--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション3
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text3 t0-b-headerFullWidthMedia-text3--size-3 t0-b-headerFullWidthMedia-text3--width- t0-b-headerFullWidthMedia-text3--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション4
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text4 t0-b-headerFullWidthMedia-text4--size-3 t0-b-headerFullWidthMedia-text4--width- t0-b-headerFullWidthMedia-text4--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション5
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text5 t0-b-headerFullWidthMedia-text5--size-3 t0-b-headerFullWidthMedia-text5--width- t0-b-headerFullWidthMedia-text5--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション6
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text6 t0-b-headerFullWidthMedia-text6--size-3 t0-b-headerFullWidthMedia-text6--width- t0-b-headerFullWidthMedia-text6--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション7
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text7 t0-b-headerFullWidthMedia-text7--size-3 t0-b-headerFullWidthMedia-text7--width- t0-b-headerFullWidthMedia-text7--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション8
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text8 t0-b-headerFullWidthMedia-text8--size-3 t0-b-headerFullWidthMedia-text8--width- t0-b-headerFullWidthMedia-text8--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
ゴシック系
バリエーション9
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text9 t0-b-headerFullWidthMedia-text9--size-3 t0-b-headerFullWidthMedia-text9--width- t0-b-headerFullWidthMedia-text9--align- g-fontFamily-gothic" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション1
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text t0-b-headerFullWidthMedia-text--size-3 t0-b-headerFullWidthMedia-text--width- t0-b-headerFullWidthMedia-text--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション2
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text2 t0-b-headerFullWidthMedia-text2--size-3 t0-b-headerFullWidthMedia-text2--width- t0-b-headerFullWidthMedia-text2--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション3
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text3 t0-b-headerFullWidthMedia-text3--size-3 t0-b-headerFullWidthMedia-text3--width- t0-b-headerFullWidthMedia-text3--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション4
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text4 t0-b-headerFullWidthMedia-text4--size-3 t0-b-headerFullWidthMedia-text4--width- t0-b-headerFullWidthMedia-text4--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション5
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text5 t0-b-headerFullWidthMedia-text5--size-3 t0-b-headerFullWidthMedia-text5--width- t0-b-headerFullWidthMedia-text5--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション6
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text6 t0-b-headerFullWidthMedia-text6--size-3 t0-b-headerFullWidthMedia-text6--width- t0-b-headerFullWidthMedia-text6--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション7
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text7 t0-b-headerFullWidthMedia-text7--size-3 t0-b-headerFullWidthMedia-text7--width- t0-b-headerFullWidthMedia-text7--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション8
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text8 t0-b-headerFullWidthMedia-text8--size-3 t0-b-headerFullWidthMedia-text8--width- t0-b-headerFullWidthMedia-text8--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
明朝系
バリエーション9
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text9 t0-b-headerFullWidthMedia-text9--size-3 t0-b-headerFullWidthMedia-text9--width- t0-b-headerFullWidthMedia-text9--align- g-fontFamily-mincho" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text t0-b-headerFullWidthMedia-text--size-3 t0-b-headerFullWidthMedia-text--width- t0-b-headerFullWidthMedia-text--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text2 t0-b-headerFullWidthMedia-text2--size-3 t0-b-headerFullWidthMedia-text2--width- t0-b-headerFullWidthMedia-text2--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション3
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text3 t0-b-headerFullWidthMedia-text3--size-3 t0-b-headerFullWidthMedia-text3--width- t0-b-headerFullWidthMedia-text3--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション4
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text4 t0-b-headerFullWidthMedia-text4--size-3 t0-b-headerFullWidthMedia-text4--width- t0-b-headerFullWidthMedia-text4--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション5
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text5 t0-b-headerFullWidthMedia-text5--size-3 t0-b-headerFullWidthMedia-text5--width- t0-b-headerFullWidthMedia-text5--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション6
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text6 t0-b-headerFullWidthMedia-text6--size-3 t0-b-headerFullWidthMedia-text6--width- t0-b-headerFullWidthMedia-text6--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション7
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text7 t0-b-headerFullWidthMedia-text7--size-3 t0-b-headerFullWidthMedia-text7--width- t0-b-headerFullWidthMedia-text7--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション8
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text8 t0-b-headerFullWidthMedia-text8--size-3 t0-b-headerFullWidthMedia-text8--width- t0-b-headerFullWidthMedia-text8--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション9
キャッチコピーを入れてください
<div>
    <div class="t0-b-headerFullWidthMedia-text9 t0-b-headerFullWidthMedia-text9--size-3 t0-b-headerFullWidthMedia-text9--width- t0-b-headerFullWidthMedia-text9--align- g-fontFamily-marugo" data-cms-path="data.contents.0">
        <div data-cms-path="data.contents.0">
            <div data-cms-contenteditable="data.contents.0.text"><strong>キャッチコピーを入れてください</strong></div>
        </div>
    </div>
</div>

書体変更

/temp/unittest/parts/227_headerFullWidthMedia-navBItem_headerFullWidthMedia-navBItem_f48.md
  • f48

ブロック名称:書体変更

[f48:書体変更(機能仕様)]

デザイン・機能仕様:

個別仕様

テストケース:

  • 指定した通りの書体で表示されていること(文章、画像下説明はNG) (PCのみ)
  • 指定なしの場合は、テーマのフォントになっていること (PCのみ)
ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem t0-b-headerFullWidthMedia-navBItem--size-3 t0-b-headerFullWidthMedia-navBItem--width-s t0-b-headerFullWidthMedia-navBItem--align-c g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
ゴシック系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem2 t0-b-headerFullWidthMedia-navBItem2--size-3 t0-b-headerFullWidthMedia-navBItem2--width-s t0-b-headerFullWidthMedia-navBItem2--align-c g-fontFamily-gothic" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem2__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem t0-b-headerFullWidthMedia-navBItem--size-3 t0-b-headerFullWidthMedia-navBItem--width-s t0-b-headerFullWidthMedia-navBItem--align-c g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
明朝系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem2 t0-b-headerFullWidthMedia-navBItem2--size-3 t0-b-headerFullWidthMedia-navBItem2--width-s t0-b-headerFullWidthMedia-navBItem2--align-c g-fontFamily-mincho" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem2__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション1
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem t0-b-headerFullWidthMedia-navBItem--size-3 t0-b-headerFullWidthMedia-navBItem--width-s t0-b-headerFullWidthMedia-navBItem--align-c g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>
丸ゴシック系
バリエーション2
詳細はこちらへ
<div>
    <div class="b-bPlacer-4s">
        <div class="t0-b-headerFullWidthMedia-navBItem2 t0-b-headerFullWidthMedia-navBItem2--size-3 t0-b-headerFullWidthMedia-navBItem2--width-s t0-b-headerFullWidthMedia-navBItem2--align-c g-fontFamily-marugo" data-height-part="">
            <div class="t0-b-headerFullWidthMedia-navBItem2__inner" data-cms-path="data.contents.0"><span><span><span></span></span></span>
                <div data-cms-contenteditable="data.contents.0.text">詳細はこちらへ</div>
            </div>
        </div>
    </div>
</div>